<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <link rel="stylesheet" type="text/css" href="css/index.css">
    <title>Document</title>
</head>
<body>
    <header>
        <div class="head_title">

            <a href="#" class="location" target="_blank" title="click and get more">GENSHIN PAIMNG</a>
            
            <div class="head_info">
                <!-- 登陆 -->
                <div class="login_info">
                    <a href="login.html" target="_blank" title="点击到登陆">您好，请先登录</a>
                    <a href="#" target="_blank" title="点击注册">注册</a>
                </div>

                <!-- 个人信息 -->
                <div class="person_info">
                    <span>|</span>
                    <a href="#" target="_balnk" title="历史订单">历史订单</a>
                    <span>|</span>
                    <a href="#" target="_balnk" title="我的收藏">我的收藏</a>
                    <span>|</span>
                    <a href="#" target="_balnk" title="帮助">帮助</a>
                    <span>|</span>
                    <a href="#" target="_balnk" title="个人信息">个人信息</a>
                </div>
            </div>

            <div class="head_search">
                <div class="search_left">
                    <a href="index.html" title="点击搜索">
                        <img src="images/genshin.png" alt="hutao">
                    </a>
                </div>

                <div class="search_right">
                    <div class="search_top">
                        <div class="search_div">
                            <input class="search_ipt"  id="search_ipt" type="search" placeholder="输入关键词"/>
                            <input class="search_btn"  onclick="search()"  type="button" value="搜索"/>
                        </div>

                        <!-- <div class="buycat">
                            <b>99</b>
                            <a href="#" target="_blank">我的购物车</a>
                        </div> -->

                    </div>
                    <div class="search_bottom">
                        <a href="#" class="selected search_bottom_a">全部</a>
                        <a href="#" class="search_bottom_a">手办</a>
                        <a href="#" class="search_bottom_a">漫画</a>
                        <a href="#" class="search_bottom_a">小说</a>
                        <a href="#" class="search_bottom_a">同人周边</a>
                        <a href="#" class="search_bottom_a">活动</a>
                        <a href="#" class="search_bottom_a">原石区</a>
                        <a href="#" class="search_bottom_a">社区物品</a>
                    </div>
                </div>

            </div>
        </div>
    </header>

    <div class="slide" id="slide">
            <img src="images/slide1.jpg" alt="">
            <img src="images/slide2.jpg" alt="">
            <img src="images/slide3.jpg" alt="">
            <img src="images/slide4.jpg" alt="">
            <img src="images/slide5.jpg" alt="">
    </div>

    <article>
        <div class="items_title">
            <a href="#" style="color: rgb(255, 255, 255);">价格</a>
            <input type="number" class="price_ipt">
            <span>-</span>
            <input type="number" class="price_ipt">
        </div>

        <div class="items_view">
            <ul id="items_viewid">

                <li>
                    <a href="#" target="_blank">
                        <img src="images/keli.jpg" alt="" titile="可莉">
                        <span>可莉</span>
                    </a>
                    <div>
                        <span>&yen;648</span>
                        <span> / 50cm</span>
                        <span class="buy"></span>
                    </div>
                </li>
                <!-- js生成 -->
            </ul>
        </div>

        <div class="page_info">
            <a class="pa" href="#items_viewid" class="active">1</a>
            <a class="pa" href="#items_viewid">2</a>
            <a class="pa" href="#items_viewid">3</a>
            <a class="pa" href="#items_viewid">4</a>
            <a class="pa" href="#items_viewid">5</a>
            <a class="pa" href="#items_viewid">6</a>
            <a class="pa" href="#items_viewid">...</a>
        </div>

    </article>

    <footer>
        <div class="foot_link">
            <a href="http://tangyuanya.top">关于我们</a><span>|</span>
            <a href="http://tangyuanya.top">联系我们</a><span>|</span>
            <a href="">招聘广告</a><span>|</span>
            <a href="http://tangyuanya.top">友情链接</a><span>|</span>
            <a href="">公司简介</a><span>|</span>
        </div>
        <p>
            Copyright &copy; 2022 <a href="http://tangyuanya.top" class="copy" target="_blank">
                满天星信息科技有限公司（假）
            </a>All Rights Reserved
        </p>
        <p>电话: 1008-610000 湘ICP备2022114115号</p>

    </footer>
</body>

<script type="text/javascript">
    window.onload = function(){
        var imgs = document.getElementById("slide").getElementsByTagName("img")
        var index = 0
        var len = imgs.length

        setInterval(function(){
            index = ++index%len
            for(var i = 0;i < len;++i)
            {
                if(index==i)
                {
                    imgs[i].style.display = "block"
                    continue
                }
                imgs[i].style.display = "none"
            }
        },2000)
    }
</script>
<script src="js/index.js"></script>

</html>